<div class="RelCompanySelectTable">
    <table class="table data-table">
        <thead>
            <tr>
                <th>{:L('name')}</th>
                <th>{:L('is_customer')}</th>
                <th>{:L('is_supplier')}</th>
                <th>{:L('owner')}</th>
                <th>{:L('operation')}</th>
            </tr>
        </thead>
        <tbody>
        <volist name='data' id='d'>
            <tr>
                <td>{$d.name}</td>
                <td>{$d.is_customer|toYesOrNo}</td>
                <td>{$d.is_supplier|toYesOrNo}</td>
                <td>{$d.user_id|toTruename}</td>
                <td><a href="javascript:RelCompany.add('{$d.id}', '{$d.name}');" class='label label-info'>{:L('select')}</a></td>
            </tr>
        </volist>
        </tbody>
    </table>
    <script type='text/javascript'>
        $(function(){
            $(".data-table").dataTable({
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "sDom": '<""l>t<"F"fp>',
                "bSort": true
            });
        });
    </script>
</div>